import {
  AfterContentInit, AfterViewInit, Component, ElementRef, EventEmitter, Inject, Input, OnInit, Output, Renderer,
  ViewChild, ViewEncapsulation
} from '@angular/core';

import {ToolsService} from "@shared/service/tools/tools.service";
import {DOCUMENT} from "@angular/platform-browser";

import {ChooseCalendarComponent} from "@train/components/choose-calendar/choose-calendar.component";
import {CalendarBtnConfig, DateStoreVO} from "@interface/index";


@Component({
  selector: 'seed-calendar-header',
  templateUrl: './calendar-header.component.html',
  styleUrls: ['./calendar-header.component.scss'],
  encapsulation: ViewEncapsulation.None,
})
export class CalendarHeaderComponent implements OnInit, AfterViewInit {
  public dateStore: DateStoreVO;
  public headerHeight: number;
  public modalWrap: boolean;
  public modalNode: any;
  public modalHeight: string;
  public timeStr: string;
  private _defaultType; // 'day', 'lastDay', 'week', 'lastWeek', 'month', 'lastMonth'
  public startTime: Date = new Date();
  public endTime: Date = new Date();
  public isShowModal = false;
  @Input() btnConfig: CalendarBtnConfig;
  @ViewChild(ChooseCalendarComponent) calendar;
  @ViewChild('modal') modal;
  @ViewChild('header') header;
  @Input()
  set defaultType(val) {
    this._defaultType = val;
    setTimeout(() => {
      this.setDefault(val);
    }, 0);
  };
  get defaultType() {
    return this._defaultType;
  }
  @Output() confirm: EventEmitter<any> = new EventEmitter();
  constructor(
    // public events: EventsService,
    private ele: ElementRef,
    private renderer: Renderer,
    private tools: ToolsService,
    @Inject(DOCUMENT) private document
  ) {

  }
  modalShow() {
    if (this.isShowModal) {
      this.modalCancel();
      return;
    }
    this.modalWrap = true;
    this.modal.show();
    this.isShowModal = true;
    const headerRect = this.header.nativeElement.getBoundingClientRect();
    this.headerHeight = headerRect.top + headerRect.height;
    this.modalNode = this.ele.nativeElement.querySelector('.seed-modal-wrapper');
    this.renderer.setElementStyle(this.modalNode, 'height', this.modalHeight);
    this.renderer.setElementStyle(this.modalNode, 'top', this.headerHeight + 'px');
  }

  modalInit() {
    this.modalHeight = this.document.documentElement.clientHeight - this.headerHeight + 'px';
  }
  modalCancel() {
    this.isShowModal = false;
    this.modal.hide();
    this.modal.goBack();
  }
  modalConfirm(val) {
    this.startTime = val[0];
    this.endTime = val[1];
    this.timeStr = this.showTime();
    this.confirm.emit(val);
    this.modal.hide();
    this.modal.goBack();
    this.isShowModal = false;
  }
  // 拼出要显示的日期格式
  showTime() {
    const startDate = this.getTimeJson(this.startTime);
    let endDate;
    if (this.endTime) {
      endDate = this.getTimeJson(this.endTime);
    }
    const type = this.tools.checkTime(this.startTime, this.endTime);
    switch (type) {
      case 'today':
        return this.showTimeStr(startDate, '', '今日');
      case 'yesterday':
        return this.showTimeStr(startDate, '', '昨日');
      case 'month':
        return this.showTimeStr(startDate, endDate, '本月');
      case 'lastMonth':
        return this.showTimeStr(startDate, endDate, '上月');
      case 'week':
        return this.showTimeStr(startDate, endDate, '本周');
      case 'lastWeek':
        return this.showTimeStr(startDate, endDate, '上周');
      case 'year':
        return this.showTimeStr(startDate, endDate, '今年');
      case 'lastYear':
        return this.showTimeStr(startDate, endDate, '去年');
      case 'free' :
        return this.showTimeStr(startDate, endDate, '');
      case 'someday' :
        return this.showTimeStr(startDate, '', '');
    }
  }

  /**
   * 获取默认类型时间
   * @param type： string
   */
  setDefault(type: string) {
    const val = this.tools.getRankTime(type);
    this.defaultTime(val);
  }

  /**
   * 设置当前组件时间并输出时间
   * @param val
   */
  defaultTime(val) {
    this.startTime = val[0];
    this.endTime = val[1];
    this.timeStr = this.showTime();
    this.confirm.emit(val);
  }
  showTimeStr(startDate, endDate?, title?) {
    if (!endDate) {
      return `${title ? title : ''} (${this.tools.getTimeStr(startDate)})`;
    } else {
      return `${title ? title : ''} (${this.tools.getTimeStr(startDate, endDate)})`;
    }
  }

  /**
   * 返回传入的时间 json对象
   * @param {Date} date
   * @returns {{y: number; m: number; d: number}}
   */
  getTimeJson(date: Date) {
    const startTimeYear = date.getFullYear();
    const startTimeMon = date.getMonth();
    const startTimeDay = date.getDate();

    const startDate = {
      y: startTimeYear,
      m: startTimeMon,
      d: startTimeDay
    };
    return startDate;
  }
  ngOnInit() {
  }
  ngAfterViewInit() {
    this.modalInit();
  }

}
